@import "src/assets/styles/variables";
/* ========= ss-platform-table */
.ss-platform-table {
  &-header {
    .ss-platform-table-cell-wraper {
      cursor: pointer;border-bottom: 1px solid #eeecec;
    }
  }
  &-cell {
    display: inline-block;vertical-align: top;white-space: normal;box-sizing: border-box;position: absolute;user-select: none; transition: all .2s ease-out 0s;
    height: 44px;background: #fff; backface-visibility: hidden;
    &-wraper {
      box-sizing: border-box;overflow: hidden;padding: 0 30px 0 42px;display: inline-block;border-right: 1px solid #eeecec;height: 44px;
      &.set {
        border-top: 1px solid #9da1c4;
        .name span {line-height: 42px;}
        .icon {line-height: 42px}
        .command{margin-top: 13px;}
      }
      &.cell-sequence {
        padding: 0;width: 44px;
        .icon {width: 44px;margin-left: 0;
          i {font-size: 17px;}
        }
        .name span {font-weight: 400;white-space: nowrap;padding: 0 8px;text-align: center;display: inline-block;width: 44px;color: #eeecec;}
      }
      &.cell-batch {
        padding: 0;width: 44px;line-height: 44px;height: 44px;text-align: center;
        input {margin-left: -1px;}
      }
      &:hover {
        .icon i {
          color: #66bb6a
        }
        .command {display: block}
      }
      .icon {
        float: left;width: 42px;line-height: 44px;height: 44px;text-align: center;margin: 0 0 0 -42px;user-select: none;
        @include ssicon(1px, pointer);
        &.slide i {animation-name: ss-s;animation-duration: .4s;animation-iteration-count: 1}
      }
      .name {
        float: left;color: #9da1c4; max-width: 100%;width: 100%;
        span {
          padding-right: 10px;float: left;overflow: hidden;display: block;white-space: nowrap;text-overflow: ellipsis;max-width: 100%;box-sizing: border-box;line-height: 44px;
        }
        em {display: inline-block;margin-left: -6px; color: #d0021b;line-height: 44px;}
      }
      .command {
        float: right;margin: 14px -20px 0 0;border: 1px solid #ececec;border-radius: 3px; display: none;
        width: 16px;height: 16px;line-height: 16px;text-align: center;box-sizing: border-box;/*transition: all .2s ease-out 0s;*/
        @include ssicon(0px, pointer);
        &.active {display: block}
        &.show-popover {display: block !important;}
      }
    }
    &-edit {
      background-color: #fff;box-shadow: 0 1px 4px rgb(0 0 0 / 40%)!important;border: none;width: 239px;height: 44px;padding: 0 30px 0 42px;line-height: 44px;
      .icon {
        float: left;margin: 0 0 0 -42px;width: 42px;line-height: 44px;height:44px;text-align: center;user-select: none;
        i {
          text-align: center;font-weight: 400 !important;text-decoration: none !important;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;
          -webkit-text-stroke-width: .22px;position: relative;font-family: ssicon;padding-left: 1px;font-size: 14px;color: #9da1c4;
        }
        @media not all, only screen and (-webkit-min-device-pixel-ratio: 2), not all, not all {
          i {-webkit-text-stroke-width: .1px;}
        }
        &.slide i {animation-name: ss-s;animation-duration: .4s;animation-iteration-count: 1}
      }
      .name input {margin: 0;padding: 0;border: none;width: 100%;height: 42px;}
    }
    &-change-type,
    &-command {
      background-color: #fff; box-shadow: 0 1px 3px rgb(0 0 0 / 30%);width: 150px;z-index: 999;
      ul {
        list-style: none;font-size: 12px;
        &:nth-child(n+1) {border-top: 1px solid #eeecec;}
        li {
          position: relative;padding: 0 30px 0 10px;height: 32px;line-height: 30px;cursor: pointer;
          overflow: hidden;display: block;white-space: nowrap;text-overflow: ellipsis;
          @include ssicon();
          i {padding-left: 1px;margin-right: 6px;font-size: 12px !important;}
          &:hover {background: #f2f6ff}
          &.current {
            color: #008ed2;
            &:after {
              content: "\E034";text-align: center;font-weight: 400 !important;text-decoration: none !important;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;
              -webkit-text-stroke-width: .22px;position: relative;font-family: ssicon;padding-left: 1px;position: absolute;color: #008ed2;right: 10px;top: 0;
            }
          }
        }
      }
    }
  }
}
